<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit:cover" />
    <title>Document</title>
    <link rel="stylesheet" href="../css/index.css">

</head>

<body>
    <div class="main">
        <!-- <div class="h1">COURSE</div> -->
        <img src="../images/TU.jpg" alt="">
        <!-- <span class="co">COURSE</span> -->
        <div class="nav">
            <div class="left">
                <img src="../images/DA3.png" mode=""></img>
                <div class="text">
                    赛事
                </div>
            </div>
            <div class="content">
                <img src="../images/DA1.png" mode=""></img>
                <div class="text">
                    作品
                </div>
            </div>
            <div class="right">
                <img src="../images/DA2.png" mode=""></img>
                <div class="text">
                    体检课
                </div>
            </div>
            <div class="right">
                <img src="../images/DA.png" mode=""></img>
                <div class="text">
                    荣誉
                </div>
            </div>
            <div class="right">
                <img src="../images/DA4.png" mode=""></img>
                <div class="text">
                    活动
                </div>
            </div>
        </div>
        <div class="title">
            <img src="../images/xing.jpg" alt="">
        </div>
        <div class="day">
            <div class="top">
                <div class="left">
                    <div class="te">荷花杯舞蹈比赛</div>
                    <div class="tex">
                        <div>赛事信息</div>
                        <div class="data">2020-10-10</div>
                    </div>
                </div>
                <div class="right">
                    <i class="iconfont icon-yanjing"></i>
                    138
                </div>
            </div>
            <div class="content">
                <img src="../images/P3.jpg" alt="">
            </div>
            <div class="bottom">
                大赛集结了21个城市的优秀舞蹈作品，是目前广东省影响面最广、规模最大、含金量最高...
            </div>
        </div>
        <div class="day">
            <div class="top">
                <div class="left">
                    <div class="te">荷花杯舞蹈比赛</div>
                    <div class="tex">
                        <div>赛事信息</div>
                        <div class="data">2020-10-10</div>
                    </div>
                </div>
                <div class="right">
                    <i class="iconfont icon-yanjing"></i>
                    138
                </div>
            </div>
            <div class="content">
                <img src="../images/P3.jpg" alt="">
            </div>
            <div class="bottom">
                大赛集结了21个城市的优秀舞蹈作品，是目前广东省影响面最广、规模最大、含金量最高...
            </div>
        </div>
        <div class="day">
            <div class="top">
                <div class="left">
                    <div class="te">荷花杯舞蹈比赛</div>
                    <div class="tex">
                        <div>赛事信息</div>
                        <div class="data">2020-10-10</div>
                    </div>
                </div>
                <div class="right">
                    <i class="iconfont icon-yanjing"></i>
                    138
                </div>
            </div>
            <div class="content">
                <img src="../images/P3.jpg" alt="">
            </div>
            <div class="bottom">
                大赛集结了21个城市的优秀舞蹈作品，是目前广东省影响面最广、规模最大、含金量最高...
            </div>
        </div>
        <div class="tab">
            <div class="icos">
                <img src="../images/DI.png" alt="">
                <div>FKM</div>
            </div>
            <div class="ico">
                <img src="../images/DL1.png" alt="">
                <div>课程</div>
            </div>
            <div class="ico">
                <img src="../images/DL2.png" alt="">
                <div>商城</div>
            </div>
            <div class="ico">
                <img src="../images/DL3.png" alt="">
                <div>大事记</div>
            </div>
            <div class="ico">
                <img src="../images/DL4.png" alt="">
                <div>会员</div>
            </div>
        </div>
    </div>
</body>

</html>
<script type="text/javascript">
    function adapter() {
        //获取布局视口宽度，因为开启了理想视口，布局视口=设备横向独立像素值
        const dpWidth = document.documentElement.clientWidth
        //计算根字体大小
        const rootFonstSize = (dpWidth * 100) / 750
        //设置根字体大小
        document.documentElement.style.fontSize = rootFonstSize + 'px'
    }
    adapter()
    window.onresize = adapter
</script>
<style>
    @import url(../css/iconfont/iconfont.css);

    * {
        margin: 0;
        padding: 0;
    }

    html,
    body {
        height: 100%;
        width: 100%;
        /* background-color: white; */
    }

    /* 滚动条添加样式 将滚动条设置为透明 ！！！！1*/

    ::-webkit-scrollbar {
        height: 0;
        width: 0;
        color: transparent;
    }

    ;
</style>